<!DOCTYPE html>
<html  lang="zh-CN" >
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <meta name="theme-color" content="#fff" id="theme-color">
  <meta name="description" content="深山磨柴斧，一鸣震江湖">
  <link rel="icon" href="/img/ic_head.jpg">
  <title>011-Android自定义View(6)：画笔Paint</title>
  
  
  <meta property="og:title" content="011-Android自定义View(6)：画笔Paint">
  
  
  <meta property="og:url" content="http://example.com/2019/07/05/011-Android%E8%87%AA%E5%AE%9A%E4%B9%89View(6)%EF%BC%9A%E7%94%BB%E7%AC%94Paint/index.html">
  
  
  <meta property="og:img" content="/img/ic_head.jpg">
  
  
  <meta property="og:img" content="深山磨柴斧，一鸣震江湖">
  
  
  <meta property="og:type" content="article">
  <meta property="og:article:published_time" content="2019-07-05">
  <meta property="og:article:modified_time" content="2021-04-14">
  <meta property="og:article:author" content="Cupster">
  
  
  <meta property="og:article:tag" content="Android">
  
  <meta property="og:article:tag" content="Android自定义View">
  
  
  
  
  <script>
    // control reverse button
    var reverseDarkList = {
      dark: 'light',
      light: 'dark'
    };
    var themeColor = {
      dark: '#1c1c1e',
      light: '#fff'
    }
    // get the data of css prefers-color-scheme
    var getCssMediaQuery = function() {
      return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
    };
    // reverse current darkmode setting function
    var reverseDarkModeSetting = function() {
      var setting = localStorage.getItem('user-color-scheme');
      if(reverseDarkList[setting]) {
        setting = reverseDarkList[setting];
      } else if(setting === null) {
        setting = reverseDarkList[getCssMediaQuery()];
      } else {
        return;
      }
      localStorage.setItem('user-color-scheme', setting);
      return setting;
    };
    // apply current darkmode setting
    var setDarkmode = function(mode) {
      var setting = mode || localStorage.getItem('user-color-scheme');
      if(setting === getCssMediaQuery()) {
        document.documentElement.removeAttribute('data-user-color-scheme');
        localStorage.removeItem('user-color-scheme');
        document.getElementById('theme-color').content = themeColor[setting];
      } else if(reverseDarkList[setting]) {
        document.documentElement.setAttribute('data-user-color-scheme', setting);
        document.getElementById('theme-color').content = themeColor[setting];
      } else {
        document.documentElement.removeAttribute('data-user-color-scheme');
        localStorage.removeItem('user-color-scheme');
        document.getElementById('theme-color').content = themeColor[getCssMediaQuery()];
      }
    };
    setDarkmode();
  </script>
  <script>
    function loadScript(url, cb) {
      var script = document.createElement('script');
      script.src = url;
      if (cb) script.onload = cb;
      script.async = true;
      document.body.appendChild(script);
    }
  </script>
  
  <link rel="preload" href="//at.alicdn.com/t/font_1946621_i1kgafibvw.css" as="style" >
  <link rel="preload" href="//at.alicdn.com/t/font_1952792_89b4ac4k4up.css" as="style" >
  
  <link rel="preload" href="/js/lib/lightbox/baguetteBox.min.js" as="script">
  <link rel="preload" href="/js/lib/lightbox/baguetteBox.min.css" as="style" >
  
  
  <link rel="preload" href="/js/lib/lozad.min.js" as="script">
  
  
  
  
  
  
  
  
<link rel="stylesheet" href="/css/main.css">

  
  
<link rel="stylesheet" href="//at.alicdn.com/t/font_1946621_i1kgafibvw.css">

  
  
<link rel="stylesheet" href="//at.alicdn.com/t/font_1952792_89b4ac4k4up.css">

  
  
<link rel="stylesheet" href="/js/lib/lightbox/baguetteBox.min.css">

  
  
  
  
<meta name="generator" content="Hexo 5.4.0"></head>


<body>
  <div class="wrapper">
    
    <nav class="navbar">
  <div class="navbar-logo">
    <span class="navbar-logo-main">
      
      <img class="navbar-logo-img" src="/img/ic_head.jpg" alt="logo">
      
      <span class="navbar-logo-dsc">不负明天</span>
    </span>
  </div>
  <div class="navbar-menu">
    
    <a href="/" class="navbar-menu-item">
    
    首页
    
    </a>
    
    <a href="/archives" class="navbar-menu-item">
    
    归档
    
    </a>
    
    <a href="/tags" class="navbar-menu-item">
    
    标签
    
    </a>
    
    <a href="/categories" class="navbar-menu-item">
    
    分类
    
    </a>
    
    <a href="/about" class="navbar-menu-item">
    
    关于
    
    </a>
    
    <a href="/links" class="navbar-menu-item">
    
    友链
    
    </a>
    
    <a class="navbar-menu-item darknavbar" id="dark"><i class="iconfont icon-weather"></i></a>
    <a class="navbar-menu-item searchnavbar" id="search"><i class="iconfont icon-search" style="font-size: 1.2rem; font-weight: 400;"></i></a>
  </div>
</nav>
    
    <div id="local-search" style="display: none;">
      <input class="navbar-menu-item" id="search-input" placeholder="请输入搜索内容...">
      <div id="search-content"></div>
    </div>
    
    <div class="section-wrap">
      <div class="container">
        <div class="columns">
          <main class="main-column">
<article class="card card-content">
  <header>
    <h1 class="post-title">
      011-Android自定义View(6)：画笔Paint
    </h1>
  </header>
  <div class="post-meta post-show-meta">
    <time datetime="2019-07-05T04:03:37.000Z">
      <i class="iconfont icon-calendar" style="margin-right: 2px;"></i>
      <span>2019-07-05</span>
    </time>
    
    <span class="dot"></span>
    
    <a href="/categories/Android/" class="post-meta-link">Android</a>
    
    
    
    <span class="dot"></span>
    <span>1.5k 字</span>
    
  </div>
  
  <div class="post-meta post-show-meta" style="margin-top: -10px;">
    <div style="display: flex; align-items: center;">
      <i class="iconfont icon-biaoqian" style="margin-right: 2px; font-size: 1.15rem;"></i>
      
      
        <a href="/tags/Android/" class="post-meta-link">Android</a>
      
      
      <span class="dot"></span>
      
        <a href="/tags/Android自定义View/" class="post-meta-link">Android自定义View</a>
      
    </div>
  </div>
  
  </header>
  <div id="section" class="post-content">
    <h1 id="简介"><a href="#简介" class="headerlink" title="简介"></a>简介</h1><p>Paint 可视为画笔，可定义颜色、线条、图案、填充等属性</p>
<h1 id="常用功能-方法"><a href="#常用功能-方法" class="headerlink" title="常用功能/方法"></a>常用功能/方法</h1><table>
<thead>
<tr>
<th>方法</th>
<th>功能</th>
<th>备注</th>
</tr>
</thead>
<tbody><tr>
<td>setColor()</td>
<td>设置画笔颜色</td>
<td></td>
</tr>
<tr>
<td>setStrokeWidth()</td>
<td>设置画笔绘线宽度  （笔芯粗细,单位px）</td>
<td>当画布缩放时，画笔粗细会跟着缩放，设置setStrokeWidth(0)时，不会跟着缩放，就一直是1px粗</td>
</tr>
<tr>
<td>setAntiAlias()</td>
<td>设置是否开启抗锯齿</td>
<td></td>
</tr>
<tr>
<td>setAlpha()</td>
<td>设置画笔透明度</td>
<td>参数取值范围【0-255】</td>
</tr>
<tr>
<td>setARGB()</td>
<td>设置透明度&amp;颜色</td>
<td></td>
</tr>
<tr>
<td>setStyle()</td>
<td>设置画笔描边模式 or 填充模式 or 填充内部+描边</td>
<td>Paint.Style.FILL 填充内部 Paint.Style.STROKE ：描边 Paint.Style.FILL_AND_STROKE ：填充内部和描边  FILL与FILL_AND_STROKE : 实际绘制尺寸一致 FILL与STROKE : STROKE实际大 FILL 二分之一的画笔线宽</td>
</tr>
<tr>
<td>setStrokeJoin()</td>
<td>设置画笔连接线头时的过渡样式</td>
<td>MITER:直来直去 ROUND: 圆角缓接 BEVEL: 斜切连接</td>
</tr>
<tr>
<td>setStrokeMiter()</td>
<td>设置斜切连接模式时，长度限制</td>
<td></td>
</tr>
<tr>
<td>setStrokeCap()</td>
<td>设置画笔画点(/圆)时的样式，笔尖离开/接触画布时的线头样式</td>
<td>BUTT平头 ROUND圆头 SQUARE方头</td>
</tr>
<tr>
<td>setPathEffect()</td>
<td>设置画线样式</td>
<td>PathEffect pathEffect = new CornerPathEffect(20); //圆角radius值 paint.setPathEffect(pathEffect); //拐角缓冲为圆角   <br/>//虚线<br/>PathEffect dashPathEffect = new DashPathEffect(new float[]{100, 50}, 0);//数组个数必须为偶数，用于设置 显示、隐藏的length ,0为偏移量<br/>paint.setPathEffect(dashPathEffect);//设置为虚线<br/>// 使用path 绘制虚线<br/>Path dashPath ;//绘制形状<br/>PathEffect pathEffect = new PathDashPathEffect(dashPath, 40, 0,  PathDashPathEffectStyle.TRANSLATE);//参数1：自定义Path，参数2：空白间隔，参数3：偏移量，参数4：拐角缓冲样式(位移：TRANSLATE 旋转：ROTATE 变体：MORPH)<br/>paint.setPathEffect(pathEffect);//设置自定义形状的虚线<br/>//线条随机偏移<br/>paint.setPathEffect(new DiscretePathEffect(50,10));//参数1：分段长度，参数2：偏移量<br/>// 同时绘制线<br/>PathEffect  sumPathEffect = new<br/>SumPathEffect(dashPathEffect, discretePathEffect);<br/>paint.setPathEffect(sumPathEffect);<br/>//合并绘制<br/>PathEffect dashPathEffect = new DashPathEffect(new float[]{20, 10}, 0);  <br/>PathEffect discretePathEffect = new DiscretePathEffect(20, 5);  <br/>PathEffect  composePathEffect = new ComposePathEffect(dashPathEffect, discretePathEffect);<br/>paint.setPathEffect(composePathEffect );  <br/>PathEffect使用时，需关闭硬件加速</td>
</tr>
<tr>
<td>setShader()</td>
<td>设置画笔渐变</td>
<td>LinearGradient linearGradient = new LinearGradient(100,100,200,100,<br/>Color.RED,Color.BLUE,Shader.TileMode.MIRROR) ;  //设置渐变区域 属性 <br/>paint.setShader(linearGradient); //设置线性渐变<br/>canvas.drawLine(100,100,500,100,paint); //划线<br/>canvas.drawRect(100,200,500,500,paint); //画矩形<br/>LinearGradient linearGradient = new LinearGradient(100,100,500,100,new int [] {Color.RED,Color.YELLOW,Color.BLUE},new float[]{0,0.5f,1},Shader.TileMode.CLAMP) ;  //设置渐变区域 属性 前2参数：起点坐标，next2参数：终点坐标，next参数:多种颜色 ，next参数：颜色位置比例，nex渐变模式：<br/>paint.setShader(linearGradient); //设置线性渐变<br/>canvas.drawLine(100,100,500,100,paint); //划线<br/>//同理径向渐变RadialGradient、 扫描渐变SweepGradient、位图渐变BitmapShader、混合渐变ComposeShader<br/>//两个颜色<br/>SweepGradient sweepGradient = new SweepGradient(400,400,Color.RED,Color.BLUE) ;//设置圆心xy起始结束颜色<br/>paint.setShader(sweepGradient); //设置扫描渐变<br/>canvas.drawCircle(400,400,300,paint); //圆心xy ,半径r<br/>//多种颜色<br/>sweepGradient = new SweepGradient(400,1200,new int[]{Color.RED,Color.YELLOW,Color.GRAY,Color.BLUE},null) ;//设置圆心，颜色，位置比例、设置为 null 则均分<br/>paint.setShader(sweepGradient); //设置扫描渐变<br/>canvas.drawCircle(400,1200,300,paint); //绘制 <br/>//两个颜色<br/>RadialGradient radialGradient = new <br/>RadialGradient(400,400,300,Color.RED,Color.BLUE,Shader.TileMode.CLAMP) ;//设置渐变区域 属性<br/>paint.setShader(radialGradient); //设置径向渐变<br/>canvas.drawCircle(400,400,300,paint); //圆心xy半径r<br/> //多种颜色<br/>radialGradient = new RadialGradient(400,1200,300,new int[]{Color.RED,Color.YELLOW,Color.GRAY,Color.BLUE},new float[]{0,0.4f,0.8f,1},Shader.TileMode.CLAMP) ;// 圆心xy,半径r，颜色数组，颜色位置比例,渐变模式<br/>paint.setShader(radialGradient); //设置径向渐变<br/>canvas.drawCircle(400,1200,300,paint); //<br/>Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.agns); //获取图片资源 转换成bitmap 对象<br/>BitmapShader bitmapShader = new BitmapShader(bitmap,Shader.TileMode.REPEAT,Shader.TileMode.CLAMP);//设置 x,y平铺模式<br/>paint.setShader(bitmapShader);<br/>canvas.drawRect(10,10,800,800,paint); <br/> Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); //获取图片资源 转换成bitmap 对象<br/>Shader  shader1 = new BitmapShader(bitmap,Shader.TileMode.REPEAT,Shader.TileMode.MIRROR);//设置 x,y  方向格式<br/> LinearGradient shader2 = new LinearGradient(   //线性渐变<br/>0,0,500,0,Color.RED,Color.BLUE,Shader.TileMode.MIRROR);<br/>// ComposeShader：结合两个 Shader<br/>Shader shader = new ComposeShader(shader1, shader2, PorterDuff.Mode.XOR); //XOR 表示 裁剪shader1 shader2 交集<br/>paint.setShader(shader);<br/>canvas.drawRect(0,0,getRight(),getBottom(),paint);</td>
</tr>
</tbody></table>
<h1 id="颜色效果处理"><a href="#颜色效果处理" class="headerlink" title="*颜色效果处理"></a>*颜色效果处理</h1><table>
<thead>
<tr>
<th>方法</th>
<th>功能</th>
<th>备注</th>
</tr>
</thead>
<tbody><tr>
<td>setColorFilter()</td>
<td>设置颜色过滤器</td>
<td>Bitmap bitmap =BitmapFactory.decodeResource(getResources(),R.mipmap.agns); //获取图片资源 转换成bitmap 对象<br/>canvas.drawBitmap(bitmap,200,200,paint);<br/>ColorFilter lightingColorFilter = new LightingColorFilter(0x00ffff, 0x000000);<br/>//去掉红色<br/> ColorFilter lightingColorFilter = new LightingColorFilter(0xffffff, 0x008800); //绿色加浓<br/>paint.setColorFilter(lightingColorFilter);<br/>canvas.drawBitmap(bitmap,200,600,paint);</td>
</tr>
<tr>
<td></td>
<td></td>
<td>Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); //获取图片<br/>canvas.drawBitmap(bitmap,200,200,paint);<br/>ColorFilter colorFilter = new PorterDuffColorFilter(Color.GREEN, PorterDuff.Mode.XOR); //去掉 和 绿色结合的部分<br/>paint.setColorFilter(colorFilter);<br/>canvas.drawBitmap(bitmap,200,600,paint);</td>
</tr>
<tr>
<td></td>
<td></td>
<td>Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); //获取图片资源<br/>canvas.drawBitmap(bitmap,200,200,paint);<br/> ColorFilter colorFilter = new PorterDuffColorFilter(Color.GREEN, <br/>PorterDuff.Mode.XOR); //<br/>paint.setColorFilter(colorFilter);<br/>canvas.drawBitmap(bitmap,200,600,paint);</td>
</tr>
<tr>
<td></td>
<td></td>
<td>Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); //获取图片资源<br/>canvas.drawBitmap(bitmap,200,200,paint);<br/>ColorMatrix colorFilter = new ColorMatrix(new float[]{<br/>-1f, 0f, 0f, 0f, 255f,<br/>0f, -1f, 0f, 0f, 255f,<br/>0f, 0f, -1f, 0f, 255f,<br/>0f, 0f, 0f, 1f, 0f }); <br/>paint.setColorFilter(new ColorMatrixColorFilter(colorFilter));<br/>canvas.drawBitmap(bitmap,200,600,paint);</td>
</tr>
<tr>
<td></td>
<td></td>
<td>Bitmap bitmapone = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); //获取图片资源 转换成bitmap 对象<br/>Bitmap bitmapTwo = BitmapFactory.decodeResource(getResources(),R.mipmap.rect_2); //获取图片资源 转换成bitmap 对象<br/>Xfermode xfermode = new PorterDuffXfermode(PorterDuff.Mode.DST_IN); //取交集，交集样式取决于下层，颜色取决于上层<br/>int saved = canvas.saveLayer(null, null, Canvas.ALL_SAVE_FLAG);<br/>canvas.drawBitmap(bitmapTwo, 0, 0, paint); <br/>paint.setXfermode(xfermode); // 设置 Xfermode<br/>canvas.drawBitmap(bitmapone, 0, 0, paint); <br/>paint.setXfermode(null); // 用完及时清除 Xfermode<br/>canvas.restoreToCount(saved);</td>
</tr>
</tbody></table>
<h1 id="色彩优化"><a href="#色彩优化" class="headerlink" title="*色彩优化"></a>*色彩优化</h1><p>自建Bitmap绘制，位深低时可开启，效果明显。</p>
<pre class="highlight"><span class="line">mPaint.setDither(<span class="keyword">true</span>);<span class="comment">//开启图像抖动</span></span><br><span class="line">mPaint.setFilterBitmap(<span class="keyword">true</span>); <span class="comment">//开启线性过滤</span></span><br></pre>

<h1 id="设置阴影效果-图层之下"><a href="#设置阴影效果-图层之下" class="headerlink" title="设置阴影效果-图层之下"></a>设置阴影效果-图层之下</h1><pre class="highlight"><span class="line">mPaint.setShadowLayer(<span class="number">20</span>, <span class="number">0</span>, <span class="number">0</span>, Color.RED);<span class="comment">//</span></span><br><span class="line">canvas.drawText(<span class="string">&quot;带阴影的文字&quot;</span>,<span class="number">100</span>,<span class="number">100</span>,mPaint);<span class="comment">//阴影模糊范围，偏移量x,y ，阴影颜色</span></span><br><span class="line">mPaint.clearShadowLayer(); <span class="comment">//清楚阴影</span></span><br></pre>

<h1 id="设置蒙层"><a href="#设置蒙层" class="headerlink" title="设置蒙层"></a>设置蒙层</h1><pre class="highlight"><span class="line"><span class="keyword">this</span>.setLayerType(LAYER_TYPE_SOFTWARE, <span class="keyword">null</span>);</span><br><span class="line">        Bitmap bitmapone = BitmapFactory.decodeResource(getResources(),R.mipmap.agns); <span class="comment">//获取图片资源 转换成bitmap 对象</span></span><br><span class="line">        BlurMaskFilter blurMaskFilterNORMAL = <span class="keyword">new</span> BlurMaskFilter(<span class="number">50</span>,BlurMaskFilter.Blur.NORMAL);</span><br><span class="line">       mPaint.setMaskFilter(blurMaskFilterNORMAL);</span><br><span class="line">        canvas.drawBitmap(bitmapone,<span class="number">50</span>,<span class="number">200</span>,mPaint);</span><br><span class="line"></span><br><span class="line"><span class="comment">//EmbossMaskFilter 方式</span></span><br><span class="line"><span class="keyword">this</span>.setLayerType(LAYER_TYPE_SOFTWARE, <span class="keyword">null</span>);</span><br><span class="line">        <span class="comment">//direction 是一个 3 个元素的数组，指定了光源的方向； ambient 是环境光的强度，数值范围是 0 到 1； specular 是炫光的系数； blurRadius 是应用光线的范围。</span></span><br><span class="line">        EmbossMaskFilter embossMaskFilter =  <span class="keyword">new</span> EmbossMaskFilter(<span class="keyword">new</span> <span class="keyword">float</span>[]&#123;<span class="number">10</span>, <span class="number">10</span>, <span class="number">10</span>&#125;, <span class="number">0.1f</span>, <span class="number">5</span>, <span class="number">5</span>);</span><br><span class="line">       mPaint.setMaskFilter(embossMaskFilter);</span><br><span class="line">        canvas.drawText(<span class="string">&quot;Test&quot;</span>,<span class="number">100</span>,<span class="number">700</span>,mPaint);</span><br></pre>







  </div>
  <div>
  
  <div class="post-note note-warning copyright" style="margin-top: 42px">
    <p><span style="font-weight: bold;">作者：</span><a target="_blank" rel="nofollow noopener noreferrer" href="http://example.com/about">Cupster</a></p>
    <p><span style="font-weight: bold;">文章链接：</span><a target="_blank" rel="nofollow noopener noreferrer" href="http://example.com/2019/07/05/011-Android%E8%87%AA%E5%AE%9A%E4%B9%89View(6)%EF%BC%9A%E7%94%BB%E7%AC%94Paint/">http://example.com/2019/07/05/011-Android%E8%87%AA%E5%AE%9A%E4%B9%89View(6)%EF%BC%9A%E7%94%BB%E7%AC%94Paint/</a></p>
    <p><span style="font-weight: bold;">版权声明：</span>本博客所有文章除特别声明外，均采用<a target="_blank" rel="noopener" href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh">CC BY-NC-SA 4.0 协议</a>。转载请注明出处！</p>
  </div>
  
  </div>
</article>
<div class="nav">
  
  <div class="nav-item-prev">
    <a href="/2019/07/12/012-Android自定义View(7)：绘制路径Path详解/" class="nav-link">
      <i class="iconfont icon-left nav-prev-icon"></i>
      <div>
        <div class="nav-label">上一篇</div>
        
        <div class="nav-title">012-Android自定义View(7)：绘制路径Path详解 </div>
        
      </div>
    </a>
  </div>
  
  
  <div class="nav-item-next">
    <a href="/2019/07/01/010-Android自定义View(5)：画布Canvas详解(图文)/" class="nav-link">
      <div>
        <div class="nav-label">下一篇</div>
        
        <div class="nav-title">010-Android自定义View(5)：画布Canvas详解(图文) </div>
        
      </div>
      <i class="iconfont icon-right nav-next-icon"></i>
    </a>
  </div>
  
</div>

<div class="card card-content toc-card" id="mobiletoc">
  <div class="toc-header"><i class="iconfont icon-menu" style="padding-right: 2px;"></i>目录</div>
<ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#%E7%AE%80%E4%BB%8B"><span class="toc-text">简介</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%B8%B8%E7%94%A8%E5%8A%9F%E8%83%BD-%E6%96%B9%E6%B3%95"><span class="toc-text">常用功能&#x2F;方法</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%A2%9C%E8%89%B2%E6%95%88%E6%9E%9C%E5%A4%84%E7%90%86"><span class="toc-text">*颜色效果处理</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%89%B2%E5%BD%A9%E4%BC%98%E5%8C%96"><span class="toc-text">*色彩优化</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%AE%BE%E7%BD%AE%E9%98%B4%E5%BD%B1%E6%95%88%E6%9E%9C-%E5%9B%BE%E5%B1%82%E4%B9%8B%E4%B8%8B"><span class="toc-text">设置阴影效果-图层之下</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%AE%BE%E7%BD%AE%E8%92%99%E5%B1%82"><span class="toc-text">设置蒙层</span></a></li></ol>
</div></main>
          <aside class="left-column">
            
            <div class="card card-author">
              
<img src="/img/ic_head.jpg" class="author-img">

<p class="author-name">Cupster</p>
<p class="author-description">深山磨柴斧，一鸣震江湖</p>
<div class="author-message">
  <a class="author-posts-count" href="/archives">
    <span>66</span>
    <span>文章</span>
  </a>
  <a class="author-categories-count" href="/categories">
    <span>5</span>
    <span>分类</span>
  </a>
  <a class="author-tags-count" href="/tags">
    <span>31</span>
    <span>标签</span>
  </a>
</div>

<div class="author-card-society">
  
    <div class="author-card-society-icon">
      <a target="_blank" rel="noopener" href="https://cupster.blog.csdn.net/">
        <i class="iconfont /img/ic_csdn.png society-icon"></i>
      </a>
    </div>
  
</div>

            </div>
            
            <div class="sticky-tablet">
  
  
  <article class="display-when-two-columns spacer">
    <div class="card card-content toc-card">
      <div class="toc-header"><i class="iconfont icon-menu" style="padding-right: 2px;"></i>目录</div>
<ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#%E7%AE%80%E4%BB%8B"><span class="toc-text">简介</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%B8%B8%E7%94%A8%E5%8A%9F%E8%83%BD-%E6%96%B9%E6%B3%95"><span class="toc-text">常用功能&#x2F;方法</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%A2%9C%E8%89%B2%E6%95%88%E6%9E%9C%E5%A4%84%E7%90%86"><span class="toc-text">*颜色效果处理</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%89%B2%E5%BD%A9%E4%BC%98%E5%8C%96"><span class="toc-text">*色彩优化</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%AE%BE%E7%BD%AE%E9%98%B4%E5%BD%B1%E6%95%88%E6%9E%9C-%E5%9B%BE%E5%B1%82%E4%B9%8B%E4%B8%8B"><span class="toc-text">设置阴影效果-图层之下</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%AE%BE%E7%BD%AE%E8%92%99%E5%B1%82"><span class="toc-text">设置蒙层</span></a></li></ol>
    </div>
  </article>
  
  
  <article class="card card-content categories-widget">
    <div class="categories-card">
  <div class="categories-header"><i class="iconfont icon-fenlei" style="padding-right: 2px;"></i>分类</div>
  <div class="categories-list">
    
      <a href="/categories/Android/">
        <div class="categories-list-item">
          Android
          <span class="categories-list-item-badge">38</span>
        </div>
      </a>
    
      <a href="/categories/Linux/">
        <div class="categories-list-item">
          Linux
          <span class="categories-list-item-badge">6</span>
        </div>
      </a>
    
      <a href="/categories/Dev-Base/">
        <div class="categories-list-item">
          Dev-Base
          <span class="categories-list-item-badge">12</span>
        </div>
      </a>
    
      <a href="/categories/Kotlin/">
        <div class="categories-list-item">
          Kotlin
          <span class="categories-list-item-badge">9</span>
        </div>
      </a>
    
      <a href="/categories/自动化脚本/">
        <div class="categories-list-item">
          自动化脚本
          <span class="categories-list-item-badge">1</span>
        </div>
      </a>
    
  </div>
</div>
  </article>
  
  <article class="card card-content tags-widget">
    <div class="tags-card">
  <div class="tags-header"><i class="iconfont icon-biaoqian" style="padding-right: 2px;"></i>热门标签</div>
  <div class="tags-list">
    
    <a href="/tags/Android/" title="Android"><div class="tags-list-item">Android</div></a>
    
    <a href="/tags/Android自定义View/" title="Android自定义View"><div class="tags-list-item">Android自定义View</div></a>
    
    <a href="/tags/MacOS/" title="MacOS"><div class="tags-list-item">MacOS</div></a>
    
    <a href="/tags/Kotlin/" title="Kotlin"><div class="tags-list-item">Kotlin</div></a>
    
    <a href="/tags/Android持久化/" title="Android持久化"><div class="tags-list-item">Android持久化</div></a>
    
    <a href="/tags/CentOS/" title="CentOS"><div class="tags-list-item">CentOS</div></a>
    
    <a href="/tags/Linux/" title="Linux"><div class="tags-list-item">Linux</div></a>
    
    <a href="/tags/Android事件/" title="Android事件"><div class="tags-list-item">Android事件</div></a>
    
    <a href="/tags/Android基础/" title="Android基础"><div class="tags-list-item">Android基础</div></a>
    
    <a href="/tags/Android手势/" title="Android手势"><div class="tags-list-item">Android手势</div></a>
    
    <a href="/tags/Scrcpy/" title="Scrcpy"><div class="tags-list-item">Scrcpy</div></a>
    
    <a href="/tags/Android动画/" title="Android动画"><div class="tags-list-item">Android动画</div></a>
    
    <a href="/tags/Git/" title="Git"><div class="tags-list-item">Git</div></a>
    
    <a href="/tags/Java/" title="Java"><div class="tags-list-item">Java</div></a>
    
    <a href="/tags/Docker/" title="Docker"><div class="tags-list-item">Docker</div></a>
    
    <a href="/tags/Android-Dialog/" title="Android Dialog"><div class="tags-list-item">Android Dialog</div></a>
    
  </div>
</div>
  </article>
  
  
</div>
          </aside>
          <aside class="right-column">
            <div class="sticky-widescreen">
  
  
  <article class="card card-content toc-card">
    <div class="toc-header"><i class="iconfont icon-menu" style="padding-right: 2px;"></i>目录</div>
<ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#%E7%AE%80%E4%BB%8B"><span class="toc-text">简介</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%B8%B8%E7%94%A8%E5%8A%9F%E8%83%BD-%E6%96%B9%E6%B3%95"><span class="toc-text">常用功能&#x2F;方法</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%A2%9C%E8%89%B2%E6%95%88%E6%9E%9C%E5%A4%84%E7%90%86"><span class="toc-text">*颜色效果处理</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%89%B2%E5%BD%A9%E4%BC%98%E5%8C%96"><span class="toc-text">*色彩优化</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%AE%BE%E7%BD%AE%E9%98%B4%E5%BD%B1%E6%95%88%E6%9E%9C-%E5%9B%BE%E5%B1%82%E4%B9%8B%E4%B8%8B"><span class="toc-text">设置阴影效果-图层之下</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E8%AE%BE%E7%BD%AE%E8%92%99%E5%B1%82"><span class="toc-text">设置蒙层</span></a></li></ol>
  </article>
  
  
  <article class="card card-content">
    <div class="recent-posts-card">
  <div class="recent-posts-header"><i class="iconfont icon-wenzhang_huaban" style="padding-right: 2px;"></i>最近文章</div>
  <div class="recent-posts-list">
    
      <div class="recent-posts-item">
        <div class="recent-posts-item-title">2021-03-02</div>
        <a href="/2021/03/02/Git commit规范/"><div class="recent-posts-item-content">Git commit规范</div></a>
      </div>
    
      <div class="recent-posts-item">
        <div class="recent-posts-item-title">2021-02-16</div>
        <a href="/2021/02/16/AutoJS一文精通AutoJS脚本教程详解/"><div class="recent-posts-item-content">AutoJS一文精通AutoJS脚本教程详解</div></a>
      </div>
    
      <div class="recent-posts-item">
        <div class="recent-posts-item-title">2021-01-21</div>
        <a href="/2021/01/21/架构师进阶：注解Annotation全解/"><div class="recent-posts-item-content">架构师进阶：注解Annotation全解</div></a>
      </div>
    
      <div class="recent-posts-item">
        <div class="recent-posts-item-title">2021-01-06</div>
        <a href="/2021/01/06/ConstraintLayout详解/"><div class="recent-posts-item-content">ConstraintLayout详解</div></a>
      </div>
    
  </div>
</div>
  </article>
  
  
</div>
          </aside>
        </div>
      </div>
    </div>
  </div>
  
  <footer class="footer">
  <div class="footer-container">
    <div>
      <div class="footer-dsc">
        <span>Copyright ©
          
          2020 -
          
          2021
        </span>
        &nbsp;
        <a href="/" class="footer-link">不负明天 </a>
      </div>
    </div>

    
    <div class="footer-dsc">
      
      Powered by
      <a href="https://hexo.io/" class="footer-link" target="_blank" rel="nofollow noopener noreferrer">&nbsp;Hexo </a>
      
      
      <span>&nbsp;|&nbsp;</span>
      
      
      Theme -
      <a href="https://github.com/theme-kaze" class="footer-link" target="_blank"
        rel="nofollow noopener noreferrer">&nbsp;Kaze</a>
      
    </div>
    
    
    
    
      <div class="footer-dsc">
        
        本站总访问量686<span id="busuanzi_value_site_pv"></span>次
        
        
        <span>&nbsp;|&nbsp;</span>
        
        
        本站总访客数219<span id="busuanzi_value_site_uv"></span>次
        
      </div>
      
    
</footer>
  <a role="button" id="scrollbutton" class="basebutton"  aria-label="回到顶部">
  <i class="iconfont icon-arrowleft button-icon"></i>
</a>
<a role="button" id="menubutton" class="basebutton">
  <i class="iconfont icon-menu button-icon"></i>
</a>
<a role="button" id="popbutton" class="basebutton" aria-label="控制中心">
  <i class="iconfont icon-expand button-icon"></i>
</a>
<a role="button" id="darkbutton" class="basebutton darkwidget" aria-label="夜色模式">
  <i class="iconfont icon-weather button-icon"></i>
</a>
<a role="button" id="searchbutton" class="basebutton searchwidget" aria-label="搜索">
  <i class="iconfont icon-search button-icon"></i>
</a>

  
  
  
  <script>
  var addImgLayout = function () {
    var img = document.querySelectorAll('.post-content img');
    var i;
    for (i = 0; i < img.length; i++) {
      var wrapper = document.createElement('a');
      wrapper.setAttribute('href', img[i].getAttribute('data-src'));
      wrapper.setAttribute('aria-label', 'illustration');
      wrapper.style.cssText = 'width: 100%; display: flex; justify-content: center;';
      if (img[i].alt) wrapper.dataset.caption = img[i].alt;
      wrapper.dataset.nolink = true;
      img[i].before(wrapper);
      wrapper.append(img[i]);
      var divWrap = document.createElement('div');
      divWrap.classList.add('gallery');
      wrapper.before(divWrap);
      divWrap.append(wrapper);
    }
    baguetteBox.run('.gallery');
  }
</script>
<script>loadScript("/js/lib/lightbox/baguetteBox.min.js", addImgLayout)</script>
  
  
  
<script src="/js/main.js"></script>

  
  <script>loadScript("/js/lib/busuanzi.min.js")</script>
  
  
  <script>
    var addLazyload = function () {
      var observer = lozad('.lozad', {
        load: function (el) {
          el.srcset = el.getAttribute('data-src');
        },
        loaded: function (el) {
          el.classList.add('loaded');
        }
      });
      observer.observe();
    }
  </script>
  <script>loadScript("/js/lib/lozad.min.js", addLazyload)</script>
  
  
</body>

</html>